<template>
  <el-row>
    <el-col :span="24">
      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" background-color="#545c64"
      text-color="#fff" active-text-color="#ffd04b" @select="handleSelect" :router="true">
      <el-menu-item index="/mdedit">Markdown编辑</el-menu-item>
      <el-menu-item index="/mdview">Markdown预览</el-menu-item>
      <el-menu-item index="/mdvite">Markdown预览(vite-plugin-md)</el-menu-item>
    </el-menu>
    </el-col>
  </el-row>
  <el-row>
    <el-col :span="24">
      <router-view></router-view>
    </el-col>
  </el-row>

</template>

<script setup lang='ts'>
import { ref } from 'vue'
const activeIndex = ref('')
const handleSelect = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
</script>
<style scoped lang="scss"></style>